<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets" 
      xmlns:f="http://java.sun.com/jsf/core">
    <ui:decorate template="/tema/padrao.xhtml">
        <ui:define name="centro"> 
            <h:form id="form">

                <p:dataTable   var="imovel" value="#{imovelBean.imoveis}"  paginator="true" rows="10" rowKey="#{imovel.codImovel}" 
                            selection="#{imovelBean.selectedImovel}" selectionMode="single" id="imoveisTable">

                    <p:ajax event="rowSelect" update=":form:display" oncomplete="Dialog.show()" />

                    <f:facet name="header">
                        Imóveis cadastrados
                    </f:facet>
                    
                    <p:column headerText="Codigo"  sortBy="#{imovel.codImovel}" filterBy="#{imovel.codImovel}" id="codImovel">
                        #{imovel.codImovel}
                    </p:column>

                    <p:column headerText="Opção" sortBy="#{imovel.opcao}" filterBy="#{imovel.opcao}" id="opcao">
                        #{imovel.opcao}
                    </p:column>

                    <p:column headerText="Tipo"  sortBy="#{imovel.tipo}" filterBy="#{imovel.tipo}" id="tipo">
                        #{imovel.tipo}
                    </p:column>

                    <p:column headerText="Valor"  sortBy="#{imovel.valor}" filterBy="#{imovel.valor}" id="valor">
                        #{imovel.valor}
                    </p:column>

                    <p:column headerText="Bairro"  sortBy="#{imovel.bairro}" filterBy="#{imovel.bairro}" id="bairro">
                        #{imovel.bairro}"
                    </p:column>
                    
                     <p:column headerText="Nº Quartos"  sortBy="#{imovel.numQuartos}" filterBy="#{imovel.numQuartos}" id="numQuartos">
                        #{imovel.numQuartos}"
                    </p:column>
                    
                    <!-- Desnecessário pois estamos utilizando "SELECTED" (SELEÇÃO AUTOMÁTICA)
                    <p:inputText type="hidden" id="areaTotal" value="{imovel.areaTotal}"/> 
                    <p:inputText type="hidden" id="areaUtil" value="{imovel.areaUtil}"/> 
                    <p:inputText type="hidden" id="numSuites" value="{imovel.numSuites}"/> 
                    <p:inputText type="hidden" id="numGaragens" value="{imovel.numGaragens}"/> 
                    <p:inputText type="hidden" id="estado" value="{imovel.estado}"/> 
                    <p:inputText type="hidden" id="endereco" value="{imovel.endereco}"/> 
                    <p:inputText type="hidden" id="obs" value="{imovel.obs}"/>  
                    <p:inputText type="hidden" id="caminho" value="{imovel.caminho}"/>
                    <p:graphicImage value="{imovel.foto}" id="imagem" cache="false"/>    
                    -->
                     
                    </p:dataTable>

                <p:dialog header="Detalhes do imóvel" widgetVar="Dialog" resizable="false"
                          width="500" showEffect="explode" hideEffect="explode">

                    <h:panelGrid id="display" columns="2" cellpadding="4">
                        
                        <f:facet name="header">
                            <!--<p:graphicImage url="/tema/imagens/icone.png" />-->                            
                            <p:graphicImage value="/tema/uploads/#{imovelBean.selectedImovel.caminho}" /> 
                        </f:facet>
                      
                        <h:outputText value="Cod:" />
                        <h:outputText value="#{imovelBean.selectedImovel.codImovel}" id="cod"/>
                        
                        <h:outputText value="Cod Proprietário:" />
                        <h:outputText converter="proprietarioConverter" value="#{imovelBean.selectedImovel.dono}" id="codDono"/>                        

                        <h:outputText value="Opção:" />
                        <h:outputText value="#{imovelBean.selectedImovel.opcao}" id="opcao"/>                        

                        <h:outputText value="Tipo:" />
                        <h:outputText value="#{imovelBean.selectedImovel.tipo}" id="tipo"/>

                        <h:outputText value="Valor:" />
                        <h:outputText value="#{imovelBean.selectedImovel.valor}" id="valor"/>
                        
                        <h:outputText value="AreaTotal:" />
                        <h:outputText value="#{imovelBean.selectedImovel.areaTotal}" id="areaTotal"/>
                        
                        <h:outputText value="Area Útil:" />
                        <h:outputText value="#{imovelBean.selectedImovel.areaUtil}" id="areaUtil"/>

                        <h:outputText value="Nº Quartos:" />
                        <h:outputText value="#{imovelBean.selectedImovel.numQuartos}" id="numQuartos"/>
                        
                        <h:outputText value="Nº Suítes:" />
                        <h:outputText value="#{imovelBean.selectedImovel.numSuites}" id="numSuites"/>
                        
                        <h:outputText value="Nº Garagens:" />
                        <h:outputText value="#{imovelBean.selectedImovel.numGaragens}" id="numGaragens"/>
                        
                        <h:outputText value="Cidade:" />
                        <h:outputText value="#{imovelBean.selectedImovel.cidade}" id="cidade"/>
                                       
                        <h:outputText value="Bairro:" />
                        <h:outputText value="#{imovelBean.selectedImovel.bairro}" id="bairro"/>
                        
                        <h:outputText value="Estado:" />
                        <h:outputText value="#{imovelBean.selectedImovel.estado}" id="estado"/>  
                    
                        <h:outputText value="endereco:" />
                        <h:outputText value="#{imovelBean.selectedImovel.endereco}" id="endereco"/>
                        
                        <h:outputText  value="obs:" />
                        <h:outputText value="#{imovelBean.selectedImovel.obs}" id="obs"/>
                        
                                       
                    </h:panelGrid>
                </p:dialog>
            </h:form>
        </ui:define>
    </ui:decorate>
</html>
